<template>
	<view class="contactview">
		<view class="topBar">
			<hx-navbar :background-color="navbarConfig.background" :fixed="true" :back="true" transparent="show" :color="navbarConfig.color"
			 title="投诉建议"></hx-navbar>
		</view>

		<view class="row-box">
			<view class="row-item">
				<text class="tit">问题类型:</text>
				<input class="input" type="text" v-model="title" placeholder="请输入问题类型" />
			</view>
			<view class="row-item">
				<textarea placeholder-style="color:#999" placeholder="请输入具体描述" auto-height maxlength="-1" v-model="content"></textarea>
			</view>
			<view class="row-item">
				<uni-upimg @change="getImageInfo" :upimg_preview="serviceArr" :upload_count="3"></uni-upimg>
			</view>
			<view class="row-item">
				<text class="tit">联系方式:</text>
				<input class="input" type="number" v-model="phone" placeholder="请输入手机号码" />
			</view>
		</view>

		<view class="fiexd-btm">
			<text>温馨提示: 请上传截图说明问题</text>
			<u-button class="custom-style" type="primary" @tap="confirm">上传</u-button>
		</view>
	</view>
</template>

<script>
	import uniUpimg from '@/components//uni-upimg/uni-upimg.vue'
	export default {
		components: {
			uniUpimg
		},
		data() {
			return {
				title: '',
				content: '',
				phone: '',
				serviceArr: []
			}
		},
		onLoad(option) {},
		methods: {
			getImageInfo(e) {
				this.serviceArr = e
			},
			//提交
			confirm() {
				if (!this.title) {
					this.$api.msg('请输入问题类型')
					return
				}
				if (!this.content) {
					this.$api.msg('请输入具体描述')
					return
				}
				if (!this.serviceArr[0]) {
					this.$api.msg('请上传图片')
					return
				}
				if (!this.phone) {
					this.$api.msg('请输入手机号')
					return
				}
				console.log(this.serviceArr)
				let data = {
					type: 2,
					title: this.title,
					content: this.content,
					images: this.serviceArr.join(','),
					phone: this.phone,
				}
				this.$api.request('POST', '/api/complaint/addComplain', data).then(res => {
					this.$api.msg('上传成功')
					setTimeout(() => {
						uni.navigateBack()
					}, 500)
				})
			},
		}
	}
</script>

<style lang="less">
	.contactview {
		min-height: 100vh;
		background-color: #fff;
	}
</style>
